<!DOCTYPE html>
<html>

<head>
    <#include "/yq/admin/components/meta.html" />
    <title>蓁奕科技 ${metaTitleSuffix!}</title>
    <#include "/yq/admin/components/stylesheets.html" />
    <style>
        .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>
</head>

<body>
    <div id='app'>
        <el-container>
            <#assign menuIndex="2-1" />
            <#include "/yq/admin/components/menu.html" />
            <el-container>
                <#include "/yq/admin/components/header.html" />
                <el-main>
                    <template>
                        <el-form ref="form" :model="form" label-width="80px">
                            <el-row :gutter="20">
                                <el-col :span="8">
                                    <el-form-item label="微信">
                                        <span>{{user.nickName}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="创建时间">
                                        <span>{{order.addTime}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="订单号">
                                        <span>{{order.out_trade_no}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="总价">
                                        <span>{{order.total_fee}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="支付类型">
                                        <span>{{order.trade_type}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="已支付">
                                        <span>{{order.paid}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="订单状态">
                                        <span v-if='order.status == 0'>未支付</span>
                                        <span v-if='order.status == 1'>已支付</span>
                                        <span v-if='order.status == -1'>退款</span>
                                        <span v-if='order.status == -2'>关闭</span>
                                        <span v-if='order.status == -3'>未支付成功</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="交易状态">
                                        <span>{{order.trade_state}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="支付ip">
                                        <span>{{order.ip}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="类型">
                                        <span v-if='order.type == 0'>未知</span>
                                        <span v-if='order.type == 1'>商品</span>
                                        <span v-if='order.type == 2'>团购</span>
                                        <span v-if='order.type == 3'>第三方支付</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="备注">
                                        <el-input v-model="order.mark" placeholder="请输入"></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="支付类型">
                                        <span>{{order.productId}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="物流号">
                                        <el-input v-model="form.trackNo" placeholder="请输入"></el-input>
                                    </el-form-item>
                                </el-col>
                                <!-- <el-col :span="8">
                                    <el-form-item label="状态">
                                        <span>{{form.status}}</span>
                                    </el-form-item>
                                </el-col> -->
                                <el-col :span="8">
                                    <el-form-item label="使用状态">
                                        <span v-if='form.isUsed == 1'>已使用</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="订单标题">
                                        <span>{{form.title}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8" v-if='form.isNeedTrack == 1'>
                                    <el-form-item label="发货状态">
                                        <span v-if='form.isDeliverd'>已发货</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8" v-if='product != null'>
                                    <el-form-item label="商品">
                                        <span>{{product.title}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8" v-if='group != null'>
                                    <el-form-item label="团购状态">
                                        <!-- <el-input v-model="group.isDone" type='text'></el-input> -->
                                        <span v-if='group.isDone ==1'>团购成功</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="24">
                                    <el-form-item label="内容">
                                        <!-- <el-input v-model="item.intro" placeholder="请输入" type='textarea'></el-input> -->
                                        <el-input v-model="introduction" placeholder="请输入" type='textarea'></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="24">
                                    <el-form-item label="额外信息">
                                        <el-input v-model="form.remark" type='textarea' readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="24">
                                    <el-form-item label="收货地址">
                                        <el-input v-model="form.address" type='textarea' readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="收货人">
                                        <el-input v-model="form.name" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="收货电话">
                                        <el-input v-model="form.mobile" readonly></el-input>
                                    </el-form-item>
                                </el-col>
                                <#if hasPermission('ORDER_SENDER')>
                                    <el-col :span="8">
                                        <el-form-item label="派送员">
                                            <el-select v-model="order.shopUserId" clearable filterable placeholder="派送员" @change='onChangeStaff'>
                                                <el-option v-for="item in shopUsers" :key="item.id" :label="item.name" :value="item.id">
                                                </el-option>
                                            </el-select>
                                        </el-form-item>
                                    </el-col>
                                </#if>
                                <!-- <el-col>
                                    <el-form-item>
                                        <el-button type="primary" @click="onSubmit">保存</el-button>
                                    </el-form-item>
                                </el-col> -->
                            </el-row>
                        </el-form>
                    </template>
                </el-main>
            </el-container>
        </el-container>
        <#include "/yq/admin/components/footer.html" />
    </div>
    <#include "/yq/admin/components/scripts.html" />
    <script type="text/javascript">
    function toJson2(text) {
        if (text == null) {
            return null
        }
        if (text == "") {
            return null
        }
        text = text.replace(/[\r]/g, "\\r")
        text = text.replace(/[\n]/g, "\\n")
        return JSON.parse(text)

    }
    var vue = new Vue({
        el: '#app',
        data() {
            return {
                imgDatas: [],
                fileList2: [],
                dialogImageUrl: '',
                dialogVisible: false,
                images: [],
                imageUrl: null,
                form: toJson(`${data!''}`) ? toJson(`${data!''}`) : {},
                product: toJson(`${product!''}`),
                group: toJson(`${group!'{}'}`),
                item: toJson2(`${item!''}`),
                shopUsers: toJson2(`${shopUsers!''}`),
                item2: {
                    intro: 'asd'
                },
                order: {
                    id: `${order.id!''}`,
                    shopUserId: Number(${order.shopUserId!''}),
                    bank_type: `${order.bank_type!''}`,
                    cash_fee: `${order.cash_fee!''}`,
                    fee_type: `${order.fee_type!''}`,
                    is_subscribe: `${order.is_subscribe!''}`,
                    out_trade_no: `${order.out_trade_no!''}`,
                    total_fee: `${order.total_fee!''}`,
                    trade_type: `${order.trade_type!''}`,
                    paid: `${order.paid!''}`,
                    status: `${order.status!''}`,
                    trade_state: `${order.trade_state!''}`,
                    paidIp: `${order.paidIp!''}`,
                    raw: `${order.raw!''}`,
                    type: `${order.type!''}`,
                    mark: `${order.mark!''}`,
                    body: `${order.body!''}`,
                    data: `${order.data!''}`,
                    productId: `${order.productId!''}`,
                    addTime: `${order.addTime!''}`
                },
                user: {
                    nickName: `${(user.nickName)!''}`,
                },
                introduction: ''
            }
        },
        mounted: function() {
            // if (this.form.images != '') {
            // this.images = this.form.images.split(';');
            // for (var idx = 0; idx < this.images.length; idx++) {
            //     var url = this.images[idx];
            //     if (url == '') {
            //         continue;
            //     }
            //     this.fileList2.push({ 'name': '', 'url': url })
            // }
            // }
            if (this.item) {
                this.introduction = this.item.intro;
            } else if (this.product) {
                this.introduction = this.product.title;
            }
        },
        methods: {
            onChangeStaff(val) {
                // alert(val)
                if (val =='') {
                    return;
                }
                var param = {
                    shopUserId: val,
                    orderId: this.order.id,
                }
                // console.log(param)
                var url = ''
                var ref = '${referer!""}'
                var url = '/yq/admin/order/updateDeliver'
                axiosRequest(param, url, ref)
            },
            onSubmit() {
                var imgs = '';
                // console.log(this.imgDatas)
                // for (var idx = 0; idx < this.imgDatas.length; idx++) {
                //     var item = this.imgDatas[idx];
                //     alert('sss')
                //     if (item.response != null) {
                //         var url = item.response.data.url;
                //         imgs = imgs + url + ';'
                //     } else {
                //         imgs = imgs + item.url + ';'
                //     }
                // }
                var param = {
                    itemId: this.form.id,
                    title: this.form.title,
                    subtitle: this.form.subtitle,
                    type: this.form.type,
                    address: this.form.address,
                    cover: this.form.cover,
                    // images: imgs,
                    intro: this.form.intro,
                    // price: this.form.price,
                }
                // console.log(param)
                var url = ''
                var ref = '${referer!""}'
                var url = '/yq/admin/item/submit'
                axiosRequest(param, url, ref)
            },
            fileChanged(file, fileList) {
                console.log(file)
                console.log(fileList)
                console.log(this.fileList2)
                this.imgDatas = fileList
                // console.log(fileList2)
                // console.log(this.imgDatas)
            },
            ck() {
                console.log(this.imgDatas)
            },
            req(file) {
                onUploadSMImage(file)
            },
            handleAvatarSuccess(res, file) {
                console.log(res)
                console.log(file)
                this.form.cover = res.data.url
                // this.form.cover = URL.createObjectURL(file.raw);
            },
        },
        filters: {
            fmt(date) {
                return date
            }
        }
    })
    </script>
    <script>
    // vue.tableData = ${items!};
    </script>
</body>

</html>